
folder { style-set: Folder; }

// define std-folder-tree style set derived from system's std-tree (defined in master.css)
@set Folder < std-tree 
{
  :root 
  {
    prototype: Folder url(folder.tis);
    display:block;
    background:transparent;
    border:none;
    overflow:scroll-indicator;
    size:*;
  }
  
  option:node {
    fill:color(text-color);
    color:color(text-color);
  }  

  option:not(:node) 
  {
    padding:0;
    fill:color(text-color-dimmed);
    background:none;
  }
  
  option:not(:node)[filename$=htm] > text,
  option:not(:node)[filename$=html] > text 
  {
    //foreground-image: url(path:M1596 380q28 28 48 76t20 88v1152q0 40-28 68t-68 28h-1344q-40 0-68-28t-28-68v-1600q0-40 28-68t68-28h896q40 0 88 20t76 48zm-444-244v376h376q-10-29-22-41l-313-313q-12-12-41-22zm384 1528v-1024h-416q-40 0-68-28t-28-68v-416h-768v1536h1280zm-928-896q8-11 21-12.5t24 6.5l51 38q11 8 12.5 21t-6.5 24l-182 243 182 243q8 11 6.5 24t-12.5 21l-51 38q-11 8-24 6.5t-21-12.5l-226-301q-14-19 0-38zm802 301q14 19 0 38l-226 301q-8 11-21 12.5t-24-6.5l-51-38q-11-8-12.5-21t6.5-24l182-243-182-243q-8-11-6.5-24t12.5-21l51-38q11-8 24-6.5t21 12.5zm-620 461q-13-2-20.5-13t-5.5-24l138-831q2-13 13-20.5t24-5.5l63 10q13 2 20.5 13t5.5 24l-138 831q-2 13-13 20.5t-24 5.5z);
    foreground-image: url(path:M1596 380q28 28 48 76t20 88v1152q0 40-28 68t-68 28h-1344q-40 0-68-28t-28-68v-1600q0-40 28-68t68-28h896q40 0 88 20t76 48zm-444-244v376h376q-10-29-22-41l-313-313q-12-12-41-22zm384 1528v-1024h-416q-40 0-68-28t-28-68v-416h-768v1536h1280zm-1024-864q0-14 9-23t23-9h704q14 0 23 9t9 23v64q0 14-9 23t-23 9h-704q-14 0-23-9t-9-23v-64zm736 224q14 0 23 9t9 23v64q0 14-9 23t-23 9h-704q-14 0-23-9t-9-23v-64q0-14 9-23t23-9h704zm0 256q14 0 23 9t9 23v64q0 14-9 23t-23 9h-704q-14 0-23-9t-9-23v-64q0-14 9-23t23-9h704z);
    foreground-size: 1em 1.2em;    
  }
  option:not(:node)[filename$=png] > text,
  option:not(:node)[filename$=jpg] > text, 
  option:not(:node)[filename$=jpeg] > text, 
  option:not(:node)[filename$=gif] > text,
  option:not(:node)[filename$=svg] > text
  {
    foreground-image: url(path:M1596 380q28 28 48 76t20 88v1152q0 40-28 68t-68 28h-1344q-40 0-68-28t-28-68v-1600q0-40 28-68t68-28h896q40 0 88 20t76 48zm-444-244v376h376q-10-29-22-41l-313-313q-12-12-41-22zm384 1528v-1024h-416q-40 0-68-28t-28-68v-416h-768v1536h1280zm-128-448v320h-1024v-192l192-192 128 128 384-384zm-832-192q-80 0-136-56t-56-136 56-136 136-56 136 56 56 136-56 136-136 56z);
    foreground-size: 1em 1.2em;    
  }


  option:node > text {
    foreground-image: url(path:M1600 1312v-704q0-40-28-68t-68-28h-704q-40 0-68-28t-28-68v-64q0-40-28-68t-68-28h-320q-40 0-68 28t-28 68v960q0 40 28 68t68 28h1216q40 0 68-28t28-68zm128-704v704q0 92-66 158t-158 66h-1216q-92 0-158-66t-66-158v-960q0-92 66-158t158-66h320q92 0 158 66t66 158v32h672q92 0 158 66t66 158z);
    foreground-size: 1.2em 0.9em;
    fill:color(text-color-dimmed);
  }
  option:node:expanded > text {
    foreground-image: url(path:M1717 931q0-35-53-35h-1088q-40 0-85.5 21.5t-71.5 52.5l-294 363q-18 24-18 40 0 35 53 35h1088q40 0 86-22t71-53l294-363q18-22 18-39zm-1141-163h768v-160q0-40-28-68t-68-28h-576q-40 0-68-28t-28-68v-64q0-40-28-68t-68-28h-320q-40 0-68 28t-28 68v853l256-315q44-53 116-87.5t140-34.5zm1269 163q0 62-46 120l-295 363q-43 53-116 87.5t-140 34.5h-1088q-92 0-158-66t-66-158v-960q0-92 66-158t158-66h320q92 0 158 66t66 158v32h544q92 0 158 66t66 158v160h192q54 0 99 24.5t67 70.5q15 32 15 68z);
  }

  option > text  /* option text */
  {
    //behavior:file-icon; /* supplies foreground image from the system */
    line-height:18dip;        
    padding:1dip 3dip 1dip 20dip;
    foreground-repeat:no-repeat;
    foreground-position:0.2em 50%;
    min-width:4em;
    @LIST-ITEM-NORMAL; 
  }
  
  option > text:rtl
  {
    padding:1dip 20dip 1dip 3dip;
    foreground-position:100% 50%;
  }
  
  /* :current hightlighting */
  option > text:hover   {  @LIST-ITEM-HOVER;  }
  option:current > text { @LIST-ITEM-CURRENT; }
  :root:focus option:current > text { @LIST-ITEM-FOCUS; }

  :root > p {
    margin:* 1em;
    padding:0.25em 0.5em;
  }

}



